<template>
  <div>
   <div>
     <div style="margin-top: 20px">
       <avue-crud ref="crud"
                  :option="option"
                  :page.sync="page"
                  :table-loading="loading"
                  @on-load="getList"
                  @row-update="rowUpdate"
                  @row-save="rowSave"
                  @row-del="rowDel"
                  @refresh-change="refreshChange"
                  @search-reset="searchChange"
                  @search-change="searchChange"
                  v-model="form"
                  :data="data">
       </avue-crud>
     </div>
   </div>
  </div>
</template>

<script>
import { getList, update, add, del } from '@/CRUD/salcfg/temp-api.js'
import option from '@/CRUD/salcfg/temp-option.js'
export default {
  name: "salSob",
  data() {
    return {
      /*  option:{
          align:'center',
          menuAlign:'center',
          column: [
            {
              label:'名字',
              prop:'name'
            },
            {
              label:'基础工资',
              prop:'basicSalary'
            },
            {
              label:'bonus',
              prop:'bonus'
            },
            {
              label:'lunchSalary',
              prop:'lunchSalary'
            },
            {
              label:'trafficSalary',
              prop:'trafficSalary'
            },
            {
              label:'pensionBase',
              prop:'pensionBase'
            },
            {
              label:'pensionPer',
              prop:'pensionPer'
            },
            {
              label:'createDate',
              prop:'createDate'
            }, {
              label:'medicalBase',
              prop:'medicalBase'
            },

          ]
        },*/
      page: {},
      form: {},
      params: {},
      loading: false,
      data: [],
      option: option(this)
    }
  },
  /*  computed: {
      ...mapGetters(['userInfo'])
    },*/
  methods: {
    getList () {
      this.loading = true;
      /*  const data = Object.assign({
          pageNum: this.page.currentPage,
          pageSize: this.page.pageSize,
        }, this.params)*/
      this.data = [];
      getList().then(res => {
        this.data = res.data.data
        this.loading = false;
        /* this.page.total = data.total;*/
        /*     const result = data.list;
             this.data = result;*/
      })
    },
    rowSave (row, done, loading) {
      add(row).then(() => {
        this.$message.success('新增成功')
        done();
        this.getList();
      }).catch(() => {
        loading()
      })
    },
    rowUpdate (row, index, done, loading) {
      update(row).then(() => {
        this.$message.success('修改成功')
        done()
        this.getList();
      }).catch(() => {
        loading()
      })
    },
    rowDel (row) {
      this.$confirm('此操作将永久删除, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return del(row.id)
      }).then(() => {
        this.$message.success('删除成功')
        this.getList();
      })
    },
    searchChange (params, done) {
      if (done) done();
      this.params = params;
      this.page.currentPage = 1;
      this.getList();
      this.$message.success('搜索成功')
    },
    refreshChange () {
      this.getList();
      this.$message.success('刷新成功')
    }
  },
  mounted() {
    this.getList()
  }

}
</script>

<style scoped>

</style>